* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
body{
    width: 100%;
    font-size: 12px;
    background-color: #F4F4F4;
    height: 3000px;
    
}
img{
    vertical-align:top;
    transition: all .3s;
    &:hover{
        opacity: 0.8;
    }
}
.w{
    width: 1190px;
    margin: auto;
    position: relative;
}
.style-red{
                color: #f10215!important;
            }
a{
    color: #666;
    text-decoration: none;
   
}
a:link{text-decoration:none; }  /* 指正常的未被访问过的链接*/

a:visited{text-decoration:none; }/*指已经访问过的链接*/

a:hover{text-decoration:none;}/*指鼠标在链接*/

a:active{text-decoration:none;}/* 指正在点的链接*/ 
//隐蔽头部
.hide-top{
    display: none;
    position: fixed;
    top: 0;
    width: 100%;
    height: 52px;
    border-bottom: 2px solid #F10214;
    background-color: #fff;
    z-index: 999999;
    .logo{
        display: block;
    position: absolute;
    left: 0;
    top: 4px;
    width: 125px;
    height: 40px;
    a{
        display: block;
        font-size: 0;
        width: 100%;
        height: 100%;
        background: url(../images/sprite.png) 0 38px;
    }
    }
    .search{
        top: 4px;
    }
    .shopcar{
        top: 4px;
    }
}

// 广告
.top{
    height: 80px;
    background-color: #2B193F;
    .advertisement{
    position: relative;
    .ad-img{
         height:100%;
    }
    .cross{
        position: absolute;
        top: 0;
        right: 0;
        color: white;
        cursor: pointer;
    }
}
}
// dropdown

.dropdown{
    width: 100%;
    height: 31px;
    background-color: #E3E4E5;
    line-height: 31px;
    .select-country{
            position: relative;
            .country{
            position: absolute;
            display: none;
            top: 31px;
            width: 322px;
           
            padding: 10px;
            background-color: #fff;
            z-index: 999;
            border: 1px solid #ccc;
            border-top: 0;
            ul{
            height: 30.4 * 7px;
            list-style: none;
            margin-bottom: 5px;
            li{
                float: left;
                width: 60px;
                a{
                    display:inline-block;
                    padding: 0 8px;
                    color: #666;
                    &:hover{
                        background-color: #F4F4F4;
                        color: #C81623;
                    }

                }
            }

        }
        }
        }

        .gat{
            display: flex;
            flex-wrap: wrap;
               padding: 5px;

            width: 280px;
            border-top: 1px dotted #666;

            a{
                
                display: flex;

                align-items: center;
                width: 50%;
                color: #666;
                &:hover{
                    color: #C81623;
                }
            }
            p{
                width: 100%;
                padding:0 2px;
                color: #666;
            }

        }

    .address{
        float: left;
        height: 31px;
        padding: 0 10px;
        color: #999999;
        cursor: pointer;

        &:hover{

        color: #C81623;

        }
    }

    .operate{

        float: right;
        list-style: none;

       .free{
           overflow: hidden;
       }
        li{
            position: relative;
            float: left;

            white-space: nowrap;

            text-overflow: ellipsis;

            span{
             margin-left: 3px;

            }
            &:nth-child(even){
                width: 1px;
                height: 12px;
                background-color: #CCCCCC;
                margin: 9px  8px;
            }
            &:nth-child(odd){
                padding: 0 10px 0 7px;
            }
            a{
              color: #999999;
              text-decoration: none;
              &:hover{
                color: #C81623!important;
            }
            }


}
    }
  
//我的京东
.my-jd{
   display: none;
    position: absolute;
    top: 31px;
    left: 0;
    width: 282px;
    height: 163px;
    background-color: #fff;
    z-index: 999;
    border: 1px solid #ccc;
    border-top: 0;
    border-bottom: 0;

        .item{
            width: 50%;

            a{
                cursor: pointer;
            }

    }
    .my-jd-one{
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        border-bottom: 1px solid #ccc;
        padding: 10px 0 10px 15px;
    }

}
//企业采购
.cai-shop{
    display: none;
    position: absolute;
    top: 31px;
    left: 0;
    background-color: #fff;
    width: 157px;
    height: 94px;
    z-index: 999;
    border: 1px solid #ccc;
    border-top: 0;
    border-bottom: 0;

    .item{
        width: 50%;

        a{
            cursor: pointer;
        }

}
.cai-shop-one{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    border-bottom: 1px solid #ccc;
    padding: 10px 0 10px 15px;
}
}
//客房服务
.house-serve{
     display: none;
     position: absolute;
     top: 31px;
     right: 0;
     width: 170px;

     background-color: #fff;
     z-index: 999;
     border: 1px solid #ccc;
     border-top: 0;
     border-bottom: 0;
        .special-item{
            width: 100%;
        }
         .item{
             width: 50%;

             a{
                 color: #999;
                 cursor: pointer;
                 &:hover{
                     color: #C81623;
                 }
             }

     }
     .house-serve-one{
         display: flex;
         flex-wrap: wrap;
         justify-content: flex-start;
         border-bottom: 1px solid #ccc;
         padding: 10px 0 10px 15px;
     }

 }
 //网站导航
 .guide-box{
     display: none;
     position: absolute;
    top: 31px;
    right: -82px;
     z-index: 999;

 .guide{
     background-color: #fff;
   display: flex;

    width: 1190px;
    padding: 10px 0 ;


    border: 1px solid #ccc;
    border-top: 0;

       .special-item{
           width: 100%;
       }
    .guide-one{
        width: 40%;
        display: flex;
        flex-wrap: wrap;


        padding: 0 0 0 20px;
        .item{
            width: 25%;
        }
    }
    .guide-two{
        width: 30%;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        border-left: 1px solid #ccc;
        padding: 0 0 0 20px;
        .item{
            width: 33.33%;
        }
    }

}}
@media screen and (max-width:1348px){
    .guide{
        max-width: 990px;
    }
    .guide-one{
        width: 33.33%;
        .item{
            width: 33.33%!important;
        }
    }
    .guide-two{
        width: 22.22%;
        .item{
            width:50%!important;
        }
    }

}
    //手机京东
    .hover{
        background-color: #fff;
    }
    .phone-box{
        display: none;
        position: absolute;
        right: 0;
        top: 31px;
        width:190px;
        height:  404px;
        background-color: #fff;
        z-index: 999;
         &::before{
               content: '';
               position: absolute;
               top: -18px;
               left: 143px;
             border-left: 10px solid transparent;
               border-right: 10px solid transparent;
                 border-top: 10px solid transparent;
                 border-bottom: 10px solid #fff;

           }

    }
    .phone-jd{
        line-height: 20px;
   height: 102px;
   width: 100%;
   border: 1px solid rgba(153, 153, 153, 0.233);
   border-top: 0;
   padding: 15px  15px 10px 7px;
       p{
           color: #E1251B;
       }
       h4{
           font-size: 12px;
         
           margin: 0 0 8px;
           font-weight: bold;
       }
       a{
           float: left;
           width: 25px;
           height:25px;
           background: url(../images/sprite_mobile@1x.png) 0 0;


       }
       a:nth-of-type(2){
               background-position: 0 51px;
           }
           a:nth-of-type(3){
               background-position: 0 25px;
           }

   .phone-img{
       float: left;
       width: 73px;
       height: 73px;
       background-color: #fff;
       display: flex;
       align-items: center;
       justify-content: center;
       box-shadow: 0 0 8px rgba(0,0,0,0.2);
       margin-right: 8px;
       img{
           width: 65px;
           box-shadow: 0 0 8px rgba(255,255,255,0.1);
       }
   }
}

}
@media screen and (max-width:1348px){
    .w{
        width: 990px;
    }
    .operate{
        li{

            max-width: 120px;
        }
    }
    .top{
        height: 61px;
        .advertisement .ad-img {
        height: 61px;
    }
    }

}
// header
.header{

    width: 100%;
    height: 140px;
    background-color: #fff;
    .logo{
        position: absolute;
        top: 0;
        left: 0;
        width: 190px;
        height: 120px;
        overflow: hidden;
        h1{
        margin: 0;
        padding: 0;
        a{
            display: block;
            width: 100%;
            height: 120px;
            text-indent: -9999px;
            background: url(../images/sprite.png) no-repeat 0 0;

        }
    }
    }

}
// search
.search{
    position: absolute;
    top: 25px;
    left: 260px;
    display: flex;

    width: 550px;
    height: 36px;

    border:1px solid #E2231A;
    a{
        text-decoration: none;
    }
    .search-content{
        flex:1;
        display: flex;
        [type="text"]{
            flex: 1;
            outline: none;
            border: 0;
            padding-left:18px ;
            font-size: 12px;
            color: #666;
          font-weight: 500;

        }
        .search-camera{

            line-height: 36px;
            font-size: 16px;
            padding: 0 18px;
            :hover{
                color: #E1251B;
            }
        }

    }
    .search-btn{
        width: 58px;
        background-color: #E1251B;
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 18px;
        font-weight: 600;
        cursor: pointer;
        &:hover{
            background-color: #C81623;
        }
    }
}
.hotwords{
    position: absolute;
    top: 65px;
    left: 260px;
    ul{
        list-style: none;
        li{
            float: left;
            padding-right:10px;
            a{
                color: #666;
                &:hover{
                    color: #C81623!important;
                }
            }
        }
    }
}
.shopcar{
    position: absolute;
    top: 25px;
    right: 230px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 136px;
    height: 36px;
    border: 1px solid #ccc;
    &:hover{
        border: 1px solid #f10215;
    }
    a{
        color: #f10215;
        &:hover{
            color: #C81623!important;
        }

    }
    .cart{
        position: relative;
        font-size: 16px;
        color: #E2231A;
        margin-right:14px;

    }
    &::after{
        content:'0';
        position: absolute;
        top: 2px;
        left: 30px;
        display: inline-block;
        height: 14px;

        color: #fff;
        padding: 0 6px;
        background-color: #E1251B;
       border-radius:7px ;
    }
}
.code{

    position: absolute;
    top: 5px;
    right: 0;
    width: 73px;
    height: 73px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 8px rgba(0,0,0,0.2);

    &::before{
        content: '';
        position: absolute;
        top: -15px;
        left: 30px;
        display: block;
        width: 0px;
        height: 0px;
        border-top:solid 10px transparent;
        border-left:solid 10px transparent;
        border-right:solid 10px  transparent;
        border-bottom:solid 10px #fff;


    }
    img{
        width: 60px;
        box-shadow: 0 0 8px rgba(255,255,255,0.1);

    }
}
.nav-list{
    position: absolute;
    left: 203px;
    top:100px;
    height: 40px;
    line-height: 40px;
    a{
        display: block;
        width: 100%;
        height: 100%;
        font-size: 15px;
        font-weight: 500;
        color: #333;
        transition: all .3s;
        &:hover{
            color:#C81623;
        }

    }
    ul{
        list-style: none;
        li{
            float: left;
            padding: 0 10px;
            &:nth-child(-n+2) a{
            color: #E1251B;
            font-weight: bold;
              }
        }
    }
}
@media screen and (max-width:1348px){
    .search{

        left: 220px;
        width: 490px;
    }
    .shopcar{
        right: 130px;
    }
    .hotwords{
        left: 220px;
    }
}
// main
.main{
    height: 480px;

    margin-bottom:30px;

    padding-top:10px ;
    .banner-left{
       float: left;
        height: 100%;
        width: 190px;
        padding: 10px 0;
        margin-right:10px ;
        background-color: #fff;

        ul{ display: flex;
        flex-direction: column;
            height: 100%;
            list-style: none;
            li{
                flex: 1;
                width:100% ;
                padding-left:14px;

                line-height: 25px;
                &:hover{
                    background: #D9D9D9;
                }
            }
            a{
                font-size: 14px;

            color: #333;
            transition: all .3s;
            &:hover{
            color:#C81623;
                    }
            }
        }
    }
    .focus{

        float: left;
        width: 590px;
        height: 470px;
        margin-right: 10px;
        background-color: #ccc;
        .swiper-container {
            position: relative;
            width: 100%;
            height: 100%;
            margin-left: auto;
            margin-right: auto;
      --swiper-theme-color: #fff;

          }

          .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;

            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
            a{
                display: block;

            }
            img{
                width: 100%;
                height: 100%;
                &:hover{
                    opacity: 1.0;
                }
            }
          }
          .circle{
            position: absolute;
            left: -200px;
            bottom: 20px;
            .swiper-pagination-bullet-active{
                position: relative;
                z-index: 999;
                 &::before{

                    content: '';
                    width:  14px;
                    height: 14px;
                    position: absolute;
                    border-radius: 50%;
                    left: 50%;
                    top: 50%;
                    transform: translate(-50%,-50%);
                    background-color: rgba(255,255,255,0.5);
            }
            }

          }

    }
    .insert-ad{
        float: left;
        width: 190px;
        height: 470px;
        margin-right: 10px;

        .swiper-container {
            width: 100%;
            height: 100%;
            margin-left: auto;
            margin-right: auto;
            --swiper-theme-color: #fff;
          }

          .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;
            height: 150px;

            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
            overflow: hidden;
            a{
                display: block;
            }
            img{
                height: 100%;
                width: 100%;

            }
          }
    }
    .banner-right{
        float: right;
        width: 190px;
        height: 470px;
     background-color: #fff;

    }

}
@media screen and (max-width:1348px){
    .w{
        width: 990px;
    }
    .insert-ad{
        display: none;
    }
}
//轮播图定制
.swiper-button-prev,.swiper-button-next{
    &::after{
        width: 25px;
        height: 35px;
        background-color:rgba(0,0,0,.1);
         font-size: 15px;
         line-height: 35px;
         text-align: center;
    }}
.swiper-button-prev{
      left: 0;

   &::after{
      border-top-right-radius: 50%;
      border-bottom-right-radius: 50%;
   }

  }
  .swiper-button-next{
      right: 0;
      &::after{
          border-top-left-radius: 50%;
          border-bottom-left-radius: 50%;
       }
  }
  //user
  .login{
      position: relative;
      width: 190px;
      height: 102px;

      padding-top: 67px;
      display: flex;
      justify-content: center;

     &::after{

            position: absolute;
            height: 1px;
            left: 15px;
            right: 15px;
            bottom: 0;
            content: '';
            background-color: #ccc;
     }
      .user-photo{
          position: absolute;
          top: 13px;
          left: 20px;
          float: left;
          height: 44px;
          width: 44px;
        padding: 2px;
        background-color: #fff;
        border-radius: 50%;
        overflow: hidden;
      }
      .user-show{
        position: absolute;
        top: 20px;
        left: 74px;
         a{
          color: #666;
          &:hover{
              color: #C81623;
          }
      }
      }
      .photo{
          display: block;
          height: 40px;
          width: 40px;

          img{
              width: 40px;
              height: 40px;
              border-radius: 50%;
          }
      }

      .new,.vip{
          width: 70px;
          height: 25px;
          line-height: 25px;
          font-size: 12px;
          text-align: center;
          border-radius: 12.5px;
        margin: 0 2px;
        padding: 0 2px;
        cursor: pointer;
      }
      .new{
          color: #FFF;
          background-color: #E1251B;
          transition: all .3s;
          &:hover{
              background-color: #C81623;
          }
      }
      .vip{
        color: #E5D790;
        background-color: #363634;
        transition: all .3s;
        &:hover{
            color: #FFF;
            background-color: #C81623;
        }
    }

  }
  
  .fast-new{
      position: relative;
    //   height: 130px;
      width: 190px;
    padding: 5px;
    margin-bottom: 5px;
      &::after{

        position: absolute;
        height: 1px;
        left: 15px;
        right: 15px;
        bottom: 0;
        content: '';
        background-color: #ccc;
 }
 .title{
     height: 20px;
     padding: 5px 0 0;
     line-height: 20px;
     margin-bottom: 8px;
     h4{
         font-size: 14px;
         font-weight: bold;
         float: left;
         margin: 0;
         padding-left: 10px;
     }
     a{
         float: right;
         color: #666;
         margin-right: 15px;
         &:hover{
            color: #C81623;
         }
     }
 }
 .icon-ctrl{
     display: block;

     float:right;
     line-height:20px ;
     transform: rotate(-90deg);
 }
 .news{
    clear: both;
     .key{
         display: inline-block;
         padding: 1px 2px;
         background-color: #FDEEED;
         color: #E1251B;
         margin:3px 6px 3px 2px ;
     }
     a{
        display: block;

        overflow: hidden;
        text-overflow: ellipsis;
         white-space: nowrap;
         color: #666;
         &:hover{
            color: #C81623;
         }
     }
 }
  }
  .service-list{
      position: relative;
     
      padding-top: 5px;
      height: 225px;
      width: 190px;

        ul{

          display: flex;
          flex-wrap: wrap;
          height: 225px;
          list-style: none;
        width: 190px;
          li{

              width: 33.33%;
              height: 25%;

              a{
                  height: 100%;
                  widows: 100%;
                display: flex;
                flex-direction: column;
              justify-content: space-around;
              align-items: center;
                  color: #666;
                  transition: all .3s;
                  &:hover{
                      color: #C81623;
                  }

                  img{
                      width: 28px;
                      height: 28px;
                  }

                  p{
                      text-align: center;
                  }
              }
          }
          .icon-prev{
            // display: none;
          }
          .icon-hover{
              display: none;
          }
      }
      .service{
          display: none;
          position: absolute;
          top: 0;
          left: 0;
          background-color: #fff;
          height: 225px;
          width: 190px;
      
          
          ol{
              list-style: none;
              padding: 0;
              margin: 0;
              li{
                  width: 33.33%;
                  height: 30px;
                  float: left;
                  text-align: center;
                  padding: 5px;
                  a{
                      color: #666;
                      &:hover{
                          color:#C81623;
                      }
                  }
              }
          }
          section{
              padding: 10px;
          }
          .huafei{
              height: 200px;
              position: absolute;
              padding:10px;
              a{
                  margin: 5px 0 0 0  ; 
                  display: inline-block;
                  color: white;
                  padding: 5px;
                  background-color: red;
                  border-radius: 17px;
                  &:hover{
                      background-color: #C81623;
                      color: white;
                  }
              }
              .cross{
                cursor: pointer;
              }
              
          }
          input[type="text"],select{
              width: 100px;
              margin:5px 10px

          }
         
      
      }
}
//second-kill
.second-kill{
    height: 260px;
    margin-bottom: 20px;
   
    .djs{
        float: left;
        height: 260px;
        width: 190px;
        background: url(../images/djs.png) 0 0;
        text-align: center;
    h2{
        font-weight: bold;
        color: #fff;
        padding-top:31px ;
    }
    p:nth-of-type(1){
        margin-top: 80px;
        font-size: 16px;
        color: #fff;
        .time{
            font-size: 18px;
            font-weight: bold;
        }
       
    }
    p:nth-of-type(2){
        text-align: center;
        color: white;
        font-size: 20px;
        font-weight: bold;
        line-height: 30px;
        span{
            display: inline-block;
            background-color: #2F3430;
            padding: 2px 4px;
        }
    }

    }
    .kill-focus-one{
        float: left;
        width: 800px;
        height: 260px;
       
        .swiper-container {
            width: 100%;
            height: 100%;
          }
      
          .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;
      
            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
          
            
            color: #666;
            transition: all .3s;
            
            &:hover{
                color: #C81623;
            }
            p{
                max-width: 160px;
                margin: 10px 0 5px 0 ;
                font-size: 12px;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
            }
            img{
                width: 140px;
                height: 140px;
            }
            .now-price{
                position: relative;
                float: left;
                width: 92px;
                height: 22px;
                background-color: #E1251B;
                text-align: center;
                font-size: 12px;
                color: white;
                span{
                    font-size: 18px;
                    font-weight: bold;
                }
                &::after{
                    content: '';
                    position: absolute;
                    right: -5px;
                    top: 0;
                    display: block;
                    height: 22px;
                    width: 10px;
                    background-color: #fff;
                    transform: skewX(-22deg);
                    border-top: 1px solid #E1251B;
                    border-bottom: 1px solid #E1251B;
                }
            }
            .prev-price{
                float: left; 
                width: 66px;
                height: 22px;
                font-size: 12px;
                line-height: 22px;
                text-align: center;
                border: 1px solid #E1251B;
                text-decoration: line-through;
                    color: #666!important;
                
            }
          }
    }
    .kill-focus-two{
        float: left;
        width: 200px;
        height: 260px;
     
        .swiper-container {
            width: 100%;
            height: 100%;
            --swiper-pagination-color: #E1251B ;
          }
      
          .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;
      
            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
       
           background-image: linear-gradient(to bottom , rgba(255,255,255,1), rgba(255,255,255,1), rgba(255,255,255,1),rgba(0,0,0,0.1));
            img{
                height: 120px;
                width: 120px;
                margin-bottom: 10px;
            }
            p{
                padding: 0;
                margin: 0;
                font-size: 14px;
                color: #666;
            }
            h5{
                padding: 0;
                margin: 0;
                color: #000;
                font-weight: bold;
            }
           span{
                display: inline-block;
                margin-top: 10px;
                font-size: 12px;
                color: #E1251B;
                border: 1px solid #E1251B;
                border-radius: 13px;
                padding: 3px 5px;
                line-height:20px ;
                cursor: pointer;
                &:hover{
                    color: white;
                    background-color: #E2231A;

                }
            }
            .icon-ctrl{
                display: block;
           
                float:right;
                line-height:20px ;
                transform: rotate(-90deg);
            }
          }
    }
    //返回顶部部分
    
    
}
.current{
        position: fixed;
        top: 120px;    
    }
aside{

    position: absolute;

    left:50%;
    margin-left: 615px;
    top: 760px;
   //position: fixed;
   // right: 60px;
   // top: 63px;
   width: 58px;
   height: 420px;
    z-index: 999;
   .icon-ctrl{
       display: block;
  
       float:right;
       font-size: 35px;
       line-height:20px ;
       transform: rotate(180deg);
   }
   a{
       position: relative;
       display: block;
       width: 58px;
       height: 60px;
       background-color: white;
       text-align: center;
       padding: 10px;
       font-size: 14px;
       color: #333;
       &:hover{
           color: white!important;
           background-color: #C81623;
       }
       &::after{
           content: '';
           position: absolute;
           bottom: 0;
           left: 9px;
           display: block;
           width: 40px;
           height: 1px;
           background-color: #ccc;
       }
   }
   .backTop{
     display: none;   
   }
  
}
@media screen and (max-width:1348px){
   
    .kill-focus-one{
        width: 600px!important;
    }
    aside{
        top: 742px;
        margin-left:515px;
    }
   
}
//特色优选
.choose-contain-one{
    display: flex;
    height: 360px;
    padding:0 0 20px 0;
    margin-top: 40px;
    
    .flash-buy{
        flex:1;
        background-color: #fff;
        .hd{
            height: 60px;
            line-height: 60px;
            padding: 0 10px 0 20px ;
        }
       
    }
    .today-discount{
        flex:1;
        margin-right: 10px;
        background-color: #fff
    }
    .hd{
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 60px;
        line-height: 60px;
        padding: 0 10px 0 20px ;
        a{
            padding-bottom: 5px;
            color: #666;
            &:hover{
                color: #C81623;
            }
            h3{
                display: inline-block;
                color: #000;
                margin: 0 10px 0 0;
                font-weight: bolder;
            }
            .icon-circle-right{
               
                font-size: 20px;
            }
        }
        ul{
            list-style: none;
            margin: 0;
            li{
                float: left;
                margin: 0 13.5px;
                a{
                    font-size: 14px;
                }
            }
        }
    }
    .discount-content{
        display: flex;
        height: 280px;
        width: 100%;
        padding: 0 15px 15px;
        background-color: #fff;
        z-index: 999;
        .discount-content-one,
        .discount-content-two{
            display: flex;
            flex-direction: column;
            justify-content:center;
            text-align: center;
            width: 190px;
        }
        .discount-content-one{
            background-color: #F8F8F9;
            font-size: 14px;
            img{
                width: 120px;
                margin: 0 auto 8px;
            }
            &:hover{
                color: #C81623;
            }
            .miaoshaprice{
                font-size: 20px;
                font-weight: bold;
                margin-right: 5px;
            }
            .jdprice{
              color: #999;
             text-decoration: line-through;
            }
           
        }
        .discount-content-two{
            
            img{
                width: 84px;
                height: 84px;
            }
            .flex-one{
                position: relative;
                flex:1;
               display: flex;

                padding: 20px  0 0 15px;
                &:hover{
                    color: #C81623;
                }
                p{
                    margin: 0;
             
                }
                .miaoshaprice{
                    font-size: 14px;
                    font-weight: bold;
                    margin-right: 5px;
                }
                .jdprice{
                  color: #999;
                 text-decoration: line-through;
                }
                &::after{
                    content:'257天最低价';
                    position: absolute;
                 
                     display: block;
                     bottom:28px;
                     left:15px;
                     background-color: #666;
                     color: white;
                     font-size: 12px;
                     width: 84px;
                     height: 20px;
                     line-height: 20px;
                     z-index: 999;
                }
            }
        }
    }
 .buy-content{
            display: flex;

            padding: 0 20px 15px 15px;
            height: 280px;
            a{
                &:hover{
                    color: #666;
                    opacity: 0.8;
                }
            }
            h4{
                font-weight: bold;
            }
            .content-left{     
                display: flex;
                flex:1;
                flex-direction: column;
                justify-content: center;
                align-items: center;    
            width: 270px;
           
            background: linear-gradient(180deg,rgba(255,211,130,.05),rgba(134,93,19,.05));
            .smallLogo{
                width: 70px;
                height: 35px;
            }
            .bigLogo{
                width: 130px;
                height: 130px;
            }
        }
            .content-right{
                display: flex;
                flex-wrap: wrap;
                
                flex:1;
                
                a{
                    position: relative;
                    width: 50%;
                    height: 33.33%;
                    text-align: center;
                    &:nth-child(odd)::after{
                        
                            content: '';
                            position: absolute;
                            width: 1px;
                            height: 60px;
                            right: 0;
                            top: 50%;
                            margin-top: -35px;
                            background: linear-gradient(180deg,white,#eeeeee,#eeeeee,white);;
                        
                    }
                }
                img{
                    width: 100px;
                    margin-bottom: 8px;
                }

            }                    
    }
}
@media screen and (max-width:1348px){
    //今日特价
    //left
    .discount-content{
        .discount-content-one, .discount-content-two{
            width: 152px!important;
        }
    .discount-content-one{

        img{
            width: 100px!important;
        }  
    }
    .discount-content-two{
        
        img{
            width: 74px!important;
             height: 74px!important;
        }
    }
    .flex-one{
        &::after{
           
             bottom:36px!important;
             left:15px!important;
             width: 74px!important;        
        }
    }
    } 
    //right
    .smallLogo{
        width: 50px!important;
        height: 25px!important;
    }
    .bigLogo{
        width: 110px!important;
        height: 110px!important;
    }
    .content-right{
        img{
            width: 80px!important;
        }

    }  
    //京东好货
    .slide{
        width: 760px!important;
    }      
}
.choose-contain-two{
    display: flex;
    
    .hd{
        width: 190px;
        height: 260px; 
        margin-right: 10px;
        background:url(../images/find-good2.png);
        .search-life{
            width: 160px;
            height: 90px;
            padding:55px 0 10px 20px;
            margin:15px auto;
            background: url(../images/find-good1.png);
           h5
           {    display: inline-block;
                color: rgb(230, 221, 207);
                
            }

        }
        &:hover{
            color: #C81623;
        }
    }
    .focus{
        position: relative;
        flex:1;
        background-color: #fff;
        overflow: hidden;
        ul{
            position: absolute;
            top: 0;
            left: 0;
            display: flex;
            list-style: none;
            width: 3000px;
            height: 230px;

            margin: 0;
            li{
                flex:1;
                   &:nth-child(odd){
                    padding: 50px 40px 0 10px;
                }   
                &:nth-child(even){
                    padding: 20px 40px 0 10px;
                }  
                a{
                    &:hover{
                        color: #C81623;
                    }
                } 
                p{
                    font-size: 14px;
                    width: 150px;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    overflow: hidden;

                }  
            }
        }
        .slide{
            display: none;
            position: absolute;
            left: 15px;
            bottom: 20px;
            width: 960px;
            height: 2px;
            background-color: #cccccc;
            .block{
                position: absolute;
                top: -4px;
                width:60px;
                height: 10px;
                background-color: #ccc;
                border-radius: 5px;
                box-shadow: 0 0 5px #000;
                cursor: pointer;
            }
        }
        img{
        width: 150px;
        height: 150px;
    }
    }
}
.choose-contain-three{
   
    height: 360px;
    padding:0 0 20px 0;
    margin-top: 20px;
    ul{ 
        display: flex;
        height: 100%;
        width: 100%;
        list-style: none;
        li{
            flex:1;
            background-color: #fff;
            &:nth-child(-n+3){
                margin-right: 10px;

            }
        }
        
    }
    .hd{
        height: 60px;
        line-height: 60px;
        padding: 0 10px 0 20px;
        h3{
            display: inline-block;
            color: #000;
            margin: 0 10px 0 0;
            font-weight: bolder;
        }
        .icon-circle-right{
               
            font-size: 20px;
        }
        a{
            
            &:hover{
                color: #C81623;
            }
        }
      }  
      .li-one{
          background-image: url(../images/cover.png);
          background-size: cover;
      .focus{
          position: relative;
          width: 290px;
          height: 250px;
          margin: 0 auto;
       img{
           height: 130px;
           width: 130px;
       }
         a{
                    &:hover{
                        color: #C81623;
                    }
                }
          .swiper-container {
            width: 100%;
            height: 100%;
          }
          .swiper-slide {
            text-align: center;
            font-size: 18px;
         
      
            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
            transition: 300ms;
            transform: scale(0.8);
            text-indent: -9999;
            h4{
                    width: 180px;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    font-size: 0;
                }
                p{
                    font-size: 0;
                }
                span{
                    font-size: 0;
                }
                
                    }
          .swiper-slide-active,.swiper-slide-duplicate-active{
            transform: scale(1);
            h4{
                font-size: 14px;             
            }
            p{
                font-size: 12px;
            }
            span{
                font-size: 16px;
            }
           
          
          }
      }
    
    }
    .li-two{
        
        .li-two-top{
            width: 250px;
            height: 40px;
            margin: 0 auto;
            text-align: center;
           
            a{
                display: inline-block;
                color: #666;
                 background: #F6F6F6;
             padding: 5px 6px ;
             border-radius: 13px;
                margin-right: 10px;
            }
            .active{
            color: #fff;
            background:#C81623;
        }
        }
        .li-two-content{
            position: relative;      
            width: 275px;
            height: 230px;
            .first,.seconds,.third{
                width: 30px;
                height: 45px;
                background-size: cover;
                text-align: center;
                p{
                    color: white;
                    opacity: 0.7;
                    font-weight: 600;
                    margin: 0;
                }
                span{
                    color: #fff;
                    font-size: 18px;
                    font-weight: 600;
                }
            }
            .first{
                position: absolute;
                top: 20px;
                left: 15px;
                background-image: url(../images/first.png);
            }
            .seconds{
                position: absolute;
                top: 90px;
                left:15px;
                background-image: url(../images/second.png);
            }
            .third{
                position: absolute;
                top: 160px;
                left: 15px;
                background-image: url(../images/third.png);
            }
            ul{
                list-style: none;
                height: 230px;
                width: 210px;
                
                margin:0 0 0 65px;
                li{ 
                    display: none;
                   // display: flex;
                    flex-direction: column;
                    margin: 0;
                   &:nth-child(1){
                    display: flex;
                   }
                    .two-item{
                    flex:1;
                    a{
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        color: #000;
                         padding:3px 0 ;
                        transition: all .3s;
                        p{
                            display: -webkit-box;
                            -webkit-line-clamp: 2;
                        -webkit-box-orient: vertical;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        font-size: 14px;
                        padding-left: 10px;
                        }
                        &:hover{
                            color: #C81623;
                        }
                    }
                }

                img{
                    height: 70px;
                }
                }
                
            }
        }
        
    }
    .li-three{
        display: flex;
        flex-direction:column ;
        
        .box{
            flex: 1;
            padding: 0 10px;
            .box-item{
                display: block;
                position: relative;
                height:calc(50% - 9px);
                width: 100%;
                padding: 15px;
                margin-bottom: 9px;
                color: #333;
              background-image: url(../upload/box-item.png);
             p{
                 font-size: 14px;
                 max-width: 50%;
                 margin: 0;
                 
             }
             &:hover{
                 color: #C81623;
             }
             span{
                 display: inline-block;
                 padding:2px ;
                 border-radius: 3px;
                 
             }
             .item-two{
                color: blue;
                border: 1px solid blue;
             } 
              .item-one{
                color: #E1251B;
                border: 1px solid #E1251B;
             }
             .guanzhu{
                 position: absolute;
                 bottom: 15px;
                 left: 15px;
                 color: #999;
             }
             .img{
                  position: absolute;
                  right: 15px;
                  top: 15px;
                 padding: 5px;
                 border-radius: 5px;
                 background-color: #fff;
             }
             img{
                
                 width: 85px;
             }
            }

        }
    }
    .li-four{
        .four-content{
            display: flex;
            flex-direction: column;
            width: 100%;
            height: calc(100% - 60px);
            background-image: url(../images/quan.png);
            background-size: 100% 100%;
            padding: 0 10px 25px;
            a{
                display: block;
                &:hover{
                    color: #C81623;
                }
            }
            .four-item{
                flex:1;
                position: relative;
                padding: 10px 40px 10px 20px;
                p{
                    margin: 0;
                   
                    &:nth-child(1) span{
                        font-size: 20px;
                        font-weight: 600;
                    }
                    &:nth-child(3) {
                        color: #333;
                    }
                } 
                span:nth-child(2){
                        color: #666;
                    }
            }
            .more-quan{
                position: absolute;
                top: 10px;
                right: 35px;
                width: 1px;
            }
            .icon-ctrl{
                position: absolute;
                top: 50%;
                left: 13px;
                transform: translateY(-50%) rotate(-90deg);
            }
        }
    }
}
@media screen and (max-width:1348px){
    .li-one{
    .focus{
   width: 240px!important;
 img{
     height: 120px!important;
     width: 120px!important;
     margin: 15px 0;
 }

}
}
.li-two-top{
    width: 240px!important;
}
.li-two-content{
    width: 240px!important;
ul{
    width: 160px!important;
    img{
        height: 60px!important;
    } 
    a{
        padding: 7px 0!important;
    } 
}
}
.li-three{ 
    .box{   
         p{
             font-size: 12px!important;         
         }
         img{    
             width: 75px!important;
         }
        }

    }
}

.ground{
    .head{
        position: relative;
        text-align: center;
        font-size: 28px;
        font-weight: bolder;
        margin: 0 auto 20px;
        &::before{
            content: '';
            position: absolute;
            top: 5px;
            left: 50%;
            margin-left: -90px;
            display: block;
            width: 25px;
            height: 20px;
            background: url(../images/sprite-pd.png) no-repeat 0 0;
        }
        &::after{
            content: '';
            position: absolute;
            top: 5px;
            right:50%;
            display: block;
            width: 25px;
            height: 20px;
            margin-right: -90px;
           
            background: url(../images/sprite-pd.png) no-repeat -25px 0;
        }
    }

}


.ground-content{
    display: flex;
    justify-content: space-between;

    ul{
        height: 950px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        list-style: none;
        
        li{
            width: 290px;
            height: 180px;
            background-color: #fff;
        }
    }
   
   .ground-content-one,.ground-content-two  {
        ul  li:first-child{
        height: 374px;
        img{
            width: 100%;
            height: 100%;
        }
        }

   }
   .ground-item{
       .hd{
           display: block;
           padding: 20px 0 8px 0;
           margin: 0 10px 0 30px;
           .span-main{
               font-size: 22px;//18
               font-weight: 600;
               color: #000;
           }
           .span-aside{
               font-size: 14px;//12
               margin-left: 5px;
               color: #666;
           } 
        }
           img{
               float: left;
               width: 100px;
               height: 100px;
               margin: 0 20px 0 25px;
           }
      
   }
}
@media screen and (max-width:1348px){
    .span-main{
        font-size: 18px!important;
  
  
    }
    .span-aside{
        font-size: 12px!important;
    } 
    .ground-item{
        img{
         width: 75px!important;
            height: 75px!important;
         
        }
    }
}
.recommend{
    .head{
        text-align: center;
        font-size: 28px;
        font-weight: bolder;
        margin: 0 auto 20px;
        &::before{
            content: '';
            position: absolute;
            top: 5px;
            left: 50%;
            margin-left: -90px;
            display: block;
            width: 25px;
            height: 20px;
            background: url(../images/sprite-pd.png) no-repeat 0 0;
        }
        &::after{
            content: '';
            position: absolute;
            top: 5px;
            right:50%;
            display: block;
            width: 25px;
            height: 20px;
            margin-right: -90px;
           
            background: url(../images/sprite-pd.png) no-repeat -25px 0;
        }
    }
}
.selected{
    .item-title{
        color: #fff!important;
        background-color: #E1251B;
          
       }
       .item-desc{
           color:#C81623 ;
       }
}
.recommend-fixed{
    display: none;
    width: 100%;
    position: fixed;
    top: 52px;
    z-index: 999;
}
.recommend-tab{
        height: 60px;
        margin-bottom: 10px;
        background-color: #fff;
        text-align: center;
        ul{
            height: 60px;
            list-style: none;
            display: flex;
            margin: 0 55px;
            li{
                position: relative;
                flex: 1;background-color: #fff;
                .bd{
                    position: absolute;
                    right: 0;
                    top: 10px;
                    width: 1px;
                    height: 40px;
                    background-image: linear-gradient(to bottom , rgba(255,255,255,1), rgba(0,0,0,0.4), rgba(255,255,255,1));
                }
            }
        }
        .item-title{
         color: #000;
         display: inline-block;
            font-size: 16px;
            font-weight: 600;
            margin: 5px 0;
            padding: 3px 8px;
            border-radius: 10px;
           
        }
        .item-desc{
            font-size: 14px;
        }
        a{
            display: block;
            &:hover{
                .item-title{
                    color: #C81623;
                }
                color: #C81623;
            }
        }
    }
.recommend-content{
        ul,ol{
            list-style: none;
        }
        ol>li{
            display: none;
            &:nth-child(1){
                display: block;
            }
        }
        ul{
            width: 1200px;
         
        li{
            float: left;
            width: 230px;
            height: 322px;
            margin: 0 5px 10px;
            background-color: #fff;
            &:nth-child(5n+1){
                margin-left: 0;
            }
            .content-item{
                display: block;
                padding:30px 40px 40px ;
            }
            img{
                width: 150px;
            }
            p{
                //设置为伸缩盒子
                display: -webkit-box;
                overflow: hidden;
                text-overflow: ellipsis;
                //设置多行显示
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                padding:0 10px;
                color: #666;
                .quan{
                    float: right;
                    padding: 0 8px;
                    margin-right: 10px;
                    border: 1px solid #C81623;
                }
            }
        }
    }
}

@media screen and (max-width:1348px){

    .ground-content{
        ul{
            height: 750px!important;
            
            li{
                width: 240px!important;
                height: 140px!important;
                
            }
        }
       
       .ground-content-one,.ground-content-two  {
            ul  li:first-child{
            height: 292px!important;
                }
       }
    }

    .recommend-content{
        ul{
            width: 1000px!important;
         
        li{
            width: 190px!important;
            height: 266px!important;
      
        .content-item{
            padding: 30px 35px;
        }
        img{
            width: 120px;
        }
    }
    }
      }

}
//尾部
.footer-service{
    clear: both;
    height: 103px;
    padding: 30px 0;
    border-bottom: 1px solid #ccc;
    ul{
        display: flex;
        height: 42px;
        list-style: none;
    
            li{
                flex:1;
                display: flex;
                justify-content: center;
                align-items: center;           
          }
        h5{
          
            height: 42px;
            width: 36px;
            background-color: pink;
        }
        p{
            line-height: 42px;
            height: 42px;               
            font-size: 18px;
            font-weight: bold;
            margin: 0 0 0 10px;
        }
    }
}
.footer-help{
    
        display: flex;
      
       padding: 20px 0;
        .item{
            flex: 1;
          
           ul{
               list-style: none;
               li{
                   padding: 2px 0;
               }
               
           }
          }  
        p,a{
           color: #666;
        }     
        a:hover{
                color:#C81623
            }
         h4{
               font-size: 14px;
              font-weight: bold; 
           }
        .special-item{
            width: 200px;
            .icon-ctrl{
                float: right;
              display: block;
             line-height: 18px;
                transform: rotate(-90deg);
            }
        }
        .look{
            float: right;
        }
    
}
.copyright{
        padding: 20px 0;
        color: #999;
        text-align: center;
    
    
    .copyright-info{
        padding: 10px 0;
    }
    .copyright-auth{
        margin: 10px 0;
        a{
            display: inline-block;
            font-size: 0;
            width: 103px;
            height: 32px;
        }
    }
  
    ul{
        list-style: none;
    
            margin: 0;
            li{  display: inline-block;
                &:nth-child(even){
                    width: 1px;
                    height: 14px;
                
                    background-color: #ccc;
                    margin: -2px 8px;
                }
            }
        }
   
    a{
        color: #999;
        &:hover{
            color: #C81623;
        }
    }
    .foreign{
        display: flex;
        justify-content: center;
        a{
            
            display: flex;

            align-items: center;
            
            color: #666;
            &:hover{
                color: #C81623;
            }
        }
        p{
            width: 100%;
            padding:0 2px;
            color: #666;
        }

    }
}